<template>
  <div class="index online">
    <Header></Header>
    <div class="main">
      <p class="current-nav">
        当前位置 :
        <router-link to="index">首页</router-link>
        <i>></i>
        <a>应急预案评审与发布</a>
        <i>></i>线上评审
      </p>
      <div class="mianOut">
        <div class="note">
          <p>
            <img
              src="../../../static/images/sound.png"
            />提示信息：您的应急预案已经编制完成了，正式发布前还需要组织应急预案评审
          </p>
        </div>
        <div class="mianInner">
          <ul class="asList clearfix">
            <li>
              <router-link
                class="active"
                :to="{
                                    path: 'onlineAssess',
                                    query: { navIndex: $route.query.navIndex }
                                }"
              >线上评审
              </router-link
              >
            </li>
            <li>
              <router-link
                :to="{
                                    path: 'underlineAssess',
                                    query: { navIndex: $route.query.navIndex }
                                }"
              >线下评审
              </router-link
              >
            </li>
          </ul>
          <div class="expert_main" v-if="flag==0">
            <div class="asBtns">
              <dl>
                <dt class="dl-btn">
                  <i class="el-icon-info"></i>温馨提示
                </dt>
                <dd>
                  （1）请提前与您选定的评审专家
                  <strong style="color:red;font-weight:800;"
                  >电话沟通评审时间、费用、需求等</strong
                  >，确保评审工作顺利开展！
                </dd>
                <dd>
                  （2）为了保证应急预案评审的客观性、公正性，请您选择与本单位无利益关系的
                  <strong style="color:red;font-weight:800;"
                  >奇数 ( ≤5 )</strong
                  >
                  个专家！如需要更多专家可以联系我们！
                </dd>
              </dl>
              <el-form
                :inline="true"
                :model="formInline"
                class="demo-form-inline clearfix"
              >
                <a class="formBtn" @click="startSet"
                >预约专家评审</a
                >
                <div class="fr clearfix">
                  <el-form-item>
                    <el-select
                      v-model="formInline.province"
                      placeholder="选择省份"
                    >
                      <el-option
                        v-for="(item, index) in types"
                        :label="item.varName"
                        :value="item.intId"
                        :key="index"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="关键字 : ">
                    <el-input
                      v-model="formInline.key"
                      style="width:300px;"
                      placeholder="请输入专家姓名"
                    ></el-input>
                  </el-form-item>
                  <el-form-item>
                    <el-button
                      class="search"
                      @click="getAllList"
                    >
                      <i class="el-icon-search"></i> 搜索
                    </el-button>
                    <el-button
                      class="search"
                      @click="reset"
                    >
                      <i class="el-icon-refresh"></i> 重置
                    </el-button>
                  </el-form-item>
                </div>
              </el-form>
            </div>
            <el-table
              ref="multipleTable1"
              v-loading="loading1"
              @selection-change="handleSelectionChange"
              :data="allData"
            >
              <el-table-column
                align="center"
                label="序号"
                width="50"
              >
                <template slot-scope="scope">{{
                  10 * (currentPage - 1) + 1 + scope.$index
                  }}
                </template>
              </el-table-column>
              <el-table-column
                label
                type="selection"
                align="center"
                width="50"
              ></el-table-column>
              <el-table-column
                prop="userName"
                label="姓名"
                align="center"
                width="100"
              ></el-table-column>
              <el-table-column
                prop="companyId"
                label="工作单位"
                align="center"
                show-overflow-tooltip
              ></el-table-column>
              <el-table-column
                prop="phone"
                label="联系电话"
                align="center"
                width="120"
              ></el-table-column>
              <el-table-column
                prop="title"
                label="职称"
                show-overflow-tooltip
                align="center"
                width="130"
              ></el-table-column>
              <el-table-column
                prop="regionId"
                label="地区"
                show-overflow-tooltip
                align="center"
                width="100"
              ></el-table-column>
              <el-table-column
                prop="businessId"
                label="所属行业"
                align="center"
                width="100"
              ></el-table-column>
              <el-table-column
                label="操作"
                align="center"
                width="160"
              >
                <template slot-scope="scope">
                  <div>
                    <el-button :class="obj.indexOf(scope.row.userId)!=-1?'btnactive':''"
                      @click="
                                                    confirm(scope.row.userId,scope.row)
                                                "
                    >已电话预约
                    </el-button
                    >
                  </div>
                </template>
              </el-table-column>
            </el-table>
            <div class="page-container">
              <el-pagination
                :pager-count="5"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-size="10"
                layout="total, prev, pager, next, jumper"
                :total="total"
              ></el-pagination>
              <el-button>确定</el-button>
            </div>
            <div class="asTitle">
              <h3>预约专家信息</h3>
            </div>
            <div class="formbtns clearfix">
              <a
                class="save"
                style="float:left;margin-left:100px; width: 120px;margin-top: 40px;margin-bottom: 40px"
                @click="startSet1"
              >组建专家团队</a
              >
              <div style="padding:0 100px;">
                <el-table
                  ref="multipleTable2"
                  :data="appiontList"
                  style="width:100%;"
                  @selection-change="changeFun"
                >

                  <el-table-column
                    type="selection"
                    align="center"
                    label="序号"
                    width="50"
                  ></el-table-column>
                  <el-table-column
                    prop="userName"
                    label="专家姓名"
                    align="center"
                    width="150"
                  ></el-table-column>
                  <el-table-column
                    prop="companyName"
                    label="工作单位"
                    align="center"
                    show-overflow-tooltip
                  ></el-table-column>
                  <el-table-column
                    prop="businessName"
                    label="所属行业"
                    align="center"
                    width="120"
                  ></el-table-column>
                  <el-table-column
                    label="预约开始时间"
                    align="center"
                    width="140"
                  >
                    <template slot-scope="scope">
                      {{scope.row.appointStartTime | timeBy}}
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="预约结束时间"
                    show-overflow-tooltip
                    align="center"
                    width="140"
                  >
                    <template slot-scope="scope">
                      {{scope.row.appointEndTime | timeBy}}
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="status"
                    label="状态"
                    :formatter="stateFormat"
                    show-overflow-tooltip
                    align="center"
                    width="120"
                  ></el-table-column>
                </el-table>
              </div>
            </div>
          </div>
          <div class="waitSend"   v-if="flag==1">
            <div class="sendMain1">
              <div class="asTitle">
                <h3>评审专家信息</h3>
              </div>
              <div class="formbtns clearfix">
                <a
                  class="save"
                  @click="addPen"
                  style="float:left;margin-left:100px;"
                >添加</a
                >
                <a
                  :class="flag3 ? 'save' : 'send send1'"
                  style="margin-right:100px;width:80px;"
                  @click="beforeSend"
                >发送</a
                >
              </div>
              <el-table ref="multipleTable" :data="selectData2">
                <el-table-column
                  align="center"
                  label="序号"
                  width="50"
                >
                  <template slot-scope="scope">{{
                    1 + scope.$index
                    }}
                  </template>
                </el-table-column>
                <el-table-column
                  prop="userName"
                  label="专家姓名"
                  align="center"
                  width="150"
                ></el-table-column>
                <el-table-column
                  prop="companyId"
                  label="工作单位"
                  align="center"
                  show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                  prop="title"
                  label="职称"
                  align="center"
                  show-overflow-tooltip
                  width="150"
                ></el-table-column>
                <el-table-column
                  prop="businessId"
                  label="所属行业"
                  align="center"
                  width="100"
                ></el-table-column>
                <el-table-column
                  prop="phone"
                  label="联系电话"
                  align="center"
                  width="120"
                ></el-table-column>
                <el-table-column
                  prop="regionId"
                  label="地区"
                  show-overflow-tooltip
                  align="center"
                  width="100"
                ></el-table-column>
                <el-table-column
                  prop="identity"
                  label="身份"
                  align="center"
                  width="50"
                ></el-table-column>
                <el-table-column
                  label="操作"
                  align="center"
                  width="340"
                >
                  <template slot-scope="scope">
                    <div>
                      <el-button
                        :class="
                                                    scope.row.identity == '组长'
                                                        ? ' detail-btn active'
                                                        : 'detail-btn'
                                                "
                        @click="
                                                    setBefore(scope.row.id, '1')
                                                "
                      >任命为组长
                      </el-button
                      >
                      <el-button
                        :class="
                                                    scope.row.identity == '组员'
                                                        ? ' detail-btn active'
                                                        : 'detail-btn'
                                                "
                        @click="
                                                    setBefore(scope.row.id, '2')
                                                "
                      >任命为组员
                      </el-button
                      >
                      <el-button
                        class="detail-btn"
                        @click="
                                                    deleteRole(scope.row.id)
                                                "
                      >删除
                      </el-button
                      >
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="sendMain2">
              <div class="asTitle">
                <h3>评审时间</h3>
              </div>
              <div class="timeSelect">
                <span>设置评审时间:</span>
                <el-date-picker
                  v-model="value1"
                  type="daterange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :picker-options="pickerOptions"
                ></el-date-picker>
              </div>
            </div>
            <!--<div class="sendMain3">
              <div class="asTitle" style="margin-bottom:50px;">
                <h3>待评审的应急预案</h3>
              </div>
              <el-table ref="multipleTable" :data="joinData">
                <el-table-column
                  type="index"
                  align="center"
                  label="序号"
                  width="100"
                ></el-table-column>
                <el-table-column
                  label="文件名称"
                  align="center"
                  show-overflow-tooltip
                >
                  <template slot-scope="scope">
                    <a class="fileName">{{
                      scope.row.templateName
                      }}</a>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="operTime"
                  label="上传时间"
                  align="center"
                  width="200"
                ></el-table-column>
              </el-table>
            </div>-->
          </div>
          <div class="backInfo"  v-if="flag==2">
            <div class="sendMain1">
              <div class="asTitle">
                <h3 style="margin-bottom:10px;">
                  评审专家信息
                </h3>
              </div>
              <div style="padding:0 100px;">
                <el-table
                  ref="multipleTable"
                  :data="selectData3"
                  style="width:100%;"
                >
                  <el-table-column
                    type="index"
                    align="center"
                    label="序号"
                    width="50"
                  ></el-table-column>
                  <el-table-column
                    prop="userName"
                    label="专家姓名"
                    align="center"
                    width="150"
                  ></el-table-column>
                  <el-table-column
                    prop="companyId"
                    label="工作单位"
                    align="center"
                    show-overflow-tooltip
                  ></el-table-column>
                  <el-table-column
                    prop="title"
                    label="职称"
                    align="center"
                    width="150"
                    show-overflow-tooltip
                  ></el-table-column>
                  <el-table-column
                    prop="businessId"
                    label="所属行业"
                    align="center"
                    width="100"
                  ></el-table-column>
                  <el-table-column
                    prop="phone"
                    label="联系电话"
                    align="center"
                    width="120"
                  ></el-table-column>
                  <el-table-column
                    prop="regionId"
                    label="地区"
                    show-overflow-tooltip
                    align="center"
                    width="100"
                  ></el-table-column>
                  <el-table-column
                    prop="identity"
                    label="身份"
                    align="center"
                    width="50"
                  ></el-table-column>
                </el-table>
              </div>
            </div>
            <div class="infoMain1" v-if="selectData3.length > 0">
              <div class="sendMain2">
                <div class="asTitle">
                  <h3>评审时间</h3>
                </div>
                <div
                  class="timeSelect"
                  style="font-size:14px;"
                  v-if="selectData2[0].startTime"
                >
                                    <span style="padding-right:30px;">
                                        <i
                                          class="el-icon-date"
                                          style="padding-right:10px;"
                                        ></i>
                                        开始日期 :{{
                                            selectData3[0].startTime.split(
                                                "00:00:00"
                                            )[0]
                                        }}
                                    </span>
                  <span>
                                        <i
                                          class="el-icon-date"
                                          style="padding-right:10px;"
                                        ></i>
                                        结束日期 :{{
                                            selectData3[0].endTime.split(
                                                "00:00:00"
                                            )[0]
                                        }}
                                    </span>
                </div>
              </div>
              <div class="asTitle">
                <h3 style="margin-bottom:20px;">
                  评审意见汇总
                </h3>
              </div>
              <el-table ref="multipleTable" :data="data4">
                <el-table-column
                  type="index"
                  align="center"
                  label="序号"
                  width="100"
                ></el-table-column>
                <!-- <el-table-column label="文件名称" align="left" prop="planSummaryName" show-overflow-tooltip ></el-table-column> -->
                <el-table-column label="类型" align="center">
                  <template slot-scope="scope">
                                        <span v-if="scope.row.reviewType == 1"
                                        >形式评审表</span
                                        >
                    <span v-if="scope.row.reviewType == 2"
                    >要素评审表</span
                    >
                    <span v-if="scope.row.reviewType == 3"
                    >附件要素评审表</span
                    >
                    <span v-if="scope.row.reviewType == 4"
                    >评审意见表</span
                    >
                  </template>
                </el-table-column>
                <el-table-column
                  label="操作"
                  align="center"
                  width="230"
                >
                  <template slot-scope="scope">
                    <el-button
                      class="detail-btn"
                      @click="
                                                goDetail(
                                                    scope.row.reviewType,
                                                    scope.row.planSummaryId,
                                                    scope.row.id
                                                )
                                            "
                    ><i class="el-icon-search"></i>查看</el-button
                    >
                    <el-button
                      class="detail-btn"
                      @click="
                                                downFile(scope.row.reviewType)
                                            "
                    ><i class="el-icon-upload2"></i>导出</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="infoMain2">
              <div class="asTitle">
                <h3>应急预案汇编修改</h3>
              </div>
              <p>
                <i class="el-icon-warning"></i
                >如果您需要根据评审意见修改应急预案，请点击应急预案汇编进行修改
              </p>
            </div>

          </div>
          <div class="backInfo">
            <div class="infoMain1">
              <div class="asTitle" style="padding-top: 30px">
                <h3>应急预案发布</h3>
              </div>
              <p >
                <i class="el-icon-warning"></i>点击发布信息填写，填写签发人和签发日期，系统自动为您生成发布文件。
              </p>
              <p style="margin-top: 10px">
                <el-button
                  class="cancel"  style="background: #2476ff;color: #fff;border: none;margin: 30px auto" @click=" releaseFlag=true"
                >发布信息填写</el-button
                >
              </p>
              <el-table :data="publishList" v-if="publishList.length>0">
                <el-table-column
                  align="center"
                  label="序号"
                  width="50"
                >
                  <template slot-scope="scope">{{
                    1 + scope.$index
                    }}
                  </template>
                </el-table-column>
                <el-table-column
                  prop="signTemplateName"
                  label="文件名"
                  align="center"
                ></el-table-column>

                <el-table-column
                  label="操作"
                  align="center"
                  width="340"
                >
                  <template slot-scope="scope">
                    <div>
                      <el-button
                        @click="look(scope.row.id)"
                        class="detail-btn"
                      ><i class="el-icon-search"></i>查看
                      </el-button>
                      <el-button
                        @click="download(scope.row.id)"
                        class="detail-btn"
                      ><i class="el-icon-download"></i>下载
                      </el-button>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </div>
      </div>
    </div>
    <Footer/>
    <el-dialog title="详情" :visible.sync="allFlag4" width="80%">
      <el-button class="print-btn" @click="clickPrinting(4)"
      >打印
      </el-button
      >
      <el-button
        @click="savePersonAll"
        class="print-btn"
        style="top:64px;right:150px;"
      >保存
      </el-button
      >
      <div
        class="ideaMain canvas"
        ref="print4"
        v-if="detailData4.length > 0"
      >
        <h2 class="ideaTitle">突发事件综合应急预案评审意见表</h2>
        <p class="comName">
          单位名称: {{ detailData4[0].companyName }}
        </p>
        <table class="ideaTable">
          <colgroup>
            <col width="160px"/>
            <col width/>
          </colgroup>
          <tr>
            <td>{{ detailData4[0].reviewItemOne }}</td>
            <td>
              <strong>{{ joinData[0].planSummaryName }}</strong>
            </td>
          </tr>
          <tr>
            <td>{{ detailData4[1].reviewItemOne }}</td>
            <td class="edit-name">
              <el-input
                placeholder="必填"
                v-model="organizationName"
                style="border:0;"
              ></el-input>
            </td>
          </tr>
          <tr>
            <td>{{ detailData4[2].reviewItemOne }}</td>
            <td>
              <p style="text-indent:20px;">
                {{
                detailData4[0].createTime
                .split(" ")[0]
                .split("-")[0] +
                "年" +
                detailData4[0].createTime
                .split(" ")[0]
                .split("-")[1] +
                "月" +
                detailData4[0].createTime
                .split(" ")[0]
                .split("-")[2]
                }}日，{{
                detailData4[2].companyName
                }}进行了应急预案专家评审工作。
                评审专家组参照《电力企业应急预案评审与备案细则》，从合法性、完整性、针对性、实用性、科学性、操作性和衔接性等方面，对应急预案的层次结构、语言文字、要素内容、附件项目等进行了系统的审查，并查看了应急预案桌面演练的记录，形成如下评审意见:
              </p>
              <textarea
                id="textarea"
                placeholder=""
                v-model="suggest2"
                style="resize:none;width:100%;border:0;color:#333;"
                readonly
              ></textarea>
            </td>
          </tr>
          <tr>
            <td>
              评审专家组
              <br/>一致认为：
            </td>
            <td>{{ consensus }}</td>
          </tr>
          <tr>
            <td>评审专家（签字）：</td>
            <td class="sign-word">
              <img
                v-for="item in signImg4"
                :key="item"
                :src="item"
                alt
                style="margin-right:10px;"
              />
            </td>
          </tr>
          <tr>
            <td>备注</td>
            <td>{{ remark5 }}</td>
          </tr>
        </table>
      </div>
    </el-dialog>
    <el-dialog title="详情" :visible.sync="allFlag1" width="80%">
      <el-button class="print-btn" @click="clickPrinting(1)"
      >打印
      </el-button
      >
      <div class="ideaMain" ref="print1">
        <h2 class="ideaTitle">电力企业应急预案形式评审表</h2>
        <table
          class="ideaTable ideaTable1"
          v-if="detailData1.length > 0"
        >
          <thead>
          <tr>
            <th rowspan="2">评审项目</th>
            <th rowspan="2">评审内容及要求</th>
            <th colspan="3">评审意见</th>
          </tr>
          <tr>
            <th class="is-ok">符合</th>
            <th class="is-ok">不符合</th>
            <th class="is-ok">基本符合</th>
          </tr>
          </thead>
          <tbody>
          <tr>
            <td>{{ detailData1[0].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData1[0].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData1[0].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData1[1].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData1[1].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData1[1].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData1[2].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData1[2].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData1[2].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td style="width:120px;">
              {{ detailData1[3].reviewItemTwo }}
            </td>
            <td style="width:300px;">
              <p>{{ detailData1[3].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData1[3].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData1[4].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData1[4].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData1[4].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData1[5].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData1[5].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData1[5].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>评审专家签字</td>
            <td colspan="4" class="sign-word">
              <img
                v-for="item in signImg1"
                :key="item"
                :src="item"
                style="margin-right:10px;"
              />
            </td>
          </tr>
          </tbody>
        </table>
      </div>
    </el-dialog>
    <el-dialog title="详情" :visible.sync="allFlag2" width="80%">
      <el-button class="print-btn" @click="clickPrinting(2)"
      >打印
      </el-button
      >
      <div class="ideaMain" ref="print2">
        <h2
          class="ideaTitle"
          style="margin-bottom:50px;text-align:center;"
        >
          电力企业综合应急预案要素评审表
        </h2>
        <table
          v-if="detailData2.length > 0"
          ref="print"
          class="ideaTable ideaTable1"
        >
          <thead>
          <tr>
            <th rowspan="2" colspan="2">评审项目</th>
            <th rowspan="2">评审内容及要求</th>
            <th colspan="3">评审意见</th>
          </tr>
          <tr>
            <th class="is-ok">符合</th>
            <th class="is-ok">不符合</th>
            <th class="is-ok">基本符合</th>
          </tr>
          </thead>
          <tbody>
          <tr>
            <td rowspan="5" class="firtTit">
              {{ detailData2[0].reviewItemOne }}
            </td>
            <td style="width:100px;text-align:center;">
              {{ detailData2[0].reviewItemTwo }}
            </td>
            <td style="min-width:400px;">
              <p>{{ detailData2[0].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[0].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[1].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[1].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[1].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[2].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[2].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[2].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[3].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[3].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[3].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[4].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[4].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[4].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="2">
              {{ detailData2[5].reviewItemTwo }}
            </td>
            <td>
              <p>{{ detailData2[5].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[5].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td rowspan="2" class="firtTit">
              {{ detailData2[6].reviewItemOne }}
            </td>
            <td>
              <p style="padding:0 10px;text-align:center;">
                {{ detailData2[6].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[6].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[6].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>
              <p
                style="padding:0 10px;text-align:center;width:120px;"
              >
                {{ detailData2[7].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[7].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[7].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td rowspan="2" class="firtTit">
              {{ detailData2[8].reviewItemOne }}
            </td>
            <td>
              <p style="padding:0 10px;text-align:center;">
                {{ detailData2[8].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[8].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[8].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>
              <p style="padding:0 10px;text-align:center;">
                {{ detailData2[9].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[9].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[9].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td rowspan="4" class="firtTit">
              {{ detailData2[10].reviewItemOne }}
            </td>
            <td>
              <p
                style="padding:0 10px;text-align:center;width:120px;"
              >
                {{ detailData2[10].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[10].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[10].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>
              <p style="padding:0 20px;text-align:center;">
                {{ detailData2[11].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[11].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[11].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>
              <p style="padding:0 20px;text-align:center;">
                {{ detailData2[12].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[12].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[12].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>
              <p style="padding:0 20px;text-align:center;">
                {{ detailData2[13].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[13].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[13].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="2">
              {{ detailData2[14].reviewItemTwo }}
            </td>
            <td>
              <p>{{ detailData2[14].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[14].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="2">
              {{ detailData2[15].reviewItemTwo }}
            </td>
            <td>
              <p>{{ detailData2[15].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[15].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="2">
              {{ detailData2[16].reviewItemTwo }}
            </td>
            <td>
              <p>{{ detailData2[16].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[16].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td rowspan="5" style="width:80px;padding:0 10px;">
              {{ detailData2[17].reviewItemOne }}
            </td>
            <td style="width:100px;text-align:center;">
              {{ detailData2[17].reviewItemTwo }}
            </td>
            <td>
              <p>{{ detailData2[17].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[17].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[18].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[18].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[18].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[19].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[19].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[19].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[20].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[20].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[20].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData2[21].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData2[21].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[21].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p>注：“＊”代表应急预案的关键要素。</p>
            </td>
          </tr>
          <tr>
            <td colspan="2">评审专家签字</td>
            <td colspan="4" class="sign-word">
              <img
                v-for="item in signImg2"
                :key="item"
                :src="item"
                alt
                style="margin-right:10px;"
              />
            </td>
          </tr>
          </tbody>
        </table>
        <h2 class="ideaTitle" style="margin-top:10px;">
          电力企业专项应急预案要素评审表
        </h2>
        <table
          class="ideaTable ideaTable1"
          v-if="detailData2.length > 0"
        >
          <thead>
          <tr>
            <th rowspan="2" colspan="2">评审项目</th>
            <th rowspan="2">评审内容及要求</th>
            <th colspan="3">评审意见</th>
          </tr>
          <tr>
            <th class="is-ok">符合</th>
            <th class="is-ok">不符合</th>
            <th class="is-ok">基本符合</th>
          </tr>
          </thead>
          <tbody>
          <tr>
            <td colspan="2">
              {{ detailData2[22].reviewItemTwo }}
            </td>
            <td>
              <p>{{ detailData2[22].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[22].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td rowspan="2" style="width:80px;padding:0 10px;">
              {{ detailData2[23].reviewItemOne }}
            </td>
            <td style="width:100px;padding:0 10px;">
              <p style="text-align:center;">
                {{ detailData2[23].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[23].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[23].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td style="width:100px;padding:0 10px;">
              <p style="text-align:center;">
                {{ detailData2[24].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[24].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[24].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td style="width:100px;padding:0 10px;" colspan="2">
              <p style="text-align:center;">
                {{ detailData2[25].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[25].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[25].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td style="width:100px;padding:0 10px;" colspan="2">
              <p style="text-align:center;">
                {{ detailData2[26].reviewItemTwo }}
              </p>
            </td>
            <td>
              <p>{{ detailData2[26].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData2[26].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p>
                注 :
                "*"代表应急预案的关键要素。如果专项应急预案作为综合应急预案的附件,综合应急预案已经明确胡要素,专项应急预案可省略。
              </p>
            </td>
          </tr>
          <tr>
            <td colspan="2">评审专家签字</td>
            <td colspan="4" class="sign-word">
              <img
                v-for="item in signImg2"
                :key="item"
                :src="item"
                alt
                style="margin-right:10px;"
              />
            </td>
          </tr>
          </tbody>
        </table>
      </div>
    </el-dialog>
    <el-dialog title="详情" :visible.sync="allFlag3" width="80%">
      <el-button @click="clickPrinting(3)" class="print-btn"
      >打印
      </el-button
      >
      <div class="ideaMain" ref="print3">
        <h2 class="ideaTitle">电力企业应急预案附件要素评审表</h2>
        <table
          v-if="detailData3.length > 0"
          class="ideaTable ideaTable1"
        >
          <thead>
          <tr>
            <th rowspan="2">评审项目</th>
            <th rowspan="2">评审内容及要求</th>
            <th colspan="3">评审意见</th>
          </tr>
          <tr>
            <th class="is-ok">符合</th>
            <th class="is-ok">不符合</th>
            <th class="is-ok">基本符合</th>
          </tr>
          </thead>
          <tbody>
          <tr>
            <td>{{ detailData3[0].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData3[0].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData3[0].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData3[1].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData3[1].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData3[1].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td>{{ detailData3[2].reviewItemTwo }}</td>
            <td>
              <p>{{ detailData3[2].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData3[2].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td style="width:120px;">
              {{ detailData3[3].reviewItemTwo }}
            </td>
            <td style="width:300px;">
              <p>{{ detailData3[3].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData3[3].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td style="width:120px;">
              {{ detailData3[4].reviewItemTwo }}
            </td>
            <td style="width:300px;">
              <p>{{ detailData3[4].reviewContent }}</p>
            </td>
            <td
              v-for="item in radios"
              :key="item"
              class="radioImg"
            >
              {{
              detailData3[4].selectResult == item
              ? "√"
              : ""
              }}
            </td>
          </tr>
          <tr>
            <td colspan="5" style="text-align:left;">
              <p>
                注 :
                附件根据应急工作需要动态设置,部分项目可省略。
              </p>
            </td>
          </tr>
          <tr>
            <td>评审专家签字</td>
            <td colspan="4" class="sign-word">
              <img
                v-for="item in signImg3"
                :key="item"
                :src="item"
                alt
                style="margin-right:10px;"
              />
            </td>
          </tr>
          </tbody>
        </table>
      </div>
    </el-dialog>
    <el-dialog
      title="系统提示"
      :visible.sync="sendFlag"
      width="35%"
      :append-to-body="true"
    >
      <div style="height:160px;">
                <span class="exitTcNote"
                >请确认和专家已沟通评审任务，点击“确定”按钮后应急预案将发送给专家进行评审。</span
                >
        <div style="overflow:hidden;margin-top:80px;">
          <a
            class="send"
            @click="sendFlag = false"
            style="margin:0;border: 1px solid #5ea0ff;color: #4080ff;width:80px;"
          >取 消</a
          >
          <a class="save" @click="sendSelect">确认</a>
        </div>
      </div>
    </el-dialog>
    <el-dialog
      title="预约专家模板"
      :visible.sync="sendFlag1"
      width="50%"
      :append-to-body="true"
    >
      <div >
                <span class="exitTcNote"
                >请确认和专家已沟通预约评审任务，并且编辑好短信模板<a style="color: red">(注：{0}替换成公司名称，{1}替换成预约开始时间，{2}替换成预约结束时间)</a>，点击“发送”按钮后预约专家将收到预约短信。</span
                >
        <div class="timeSelect" style="margin-bottom: 20px">
          <span style="width: 120px;display: inline-block">设置预约评审时间:</span>
          <el-date-picker
            v-model="appiontTime"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
            style="width: 80%"
            @change="selectTime"
          ></el-date-picker>
        </div>
        <div class="timeSelect">
          <span style="width: 120px;display: inline-block">请编辑评审模板:</span>
          <el-input
            type="textarea"
            v-model="smsTemplate"
            rows="5"
            placeholder="请输入短信信息"
            style="width: 80%;"
          ></el-input>
        </div>
        <div style="overflow:hidden;margin-top:50px;">
          <a
            class="send"
            @click="sendFlag1 = false"
            style="margin:0;border: 1px solid #5ea0ff;color: #4080ff;width:80px;"
          >取 消</a
          >
          <a class="save" @click="sendAppiont">发送</a>
        </div>
      </div>
    </el-dialog>
    <el-dialog
      title="发布信息"
      :visible.sync="releaseFlag"
      width="45%"
      :append-to-body="true"
    >
      <div>
        <div class="timeSelect" style="margin-bottom: 20px">
          <span style="width: 120px;display: inline-block">签发人:</span>
          <el-input
            v-model="releaseUser"
            style="width: 80%;"
          ></el-input>
        </div>
        <div class="timeSelect">
          <span style="width: 120px;display: inline-block">签发日期:</span>
          <el-date-picker
            v-model="releaseTime"
            value-format="yyyy-MM-dd HH:mm:ss"
            type="date"
            style="width: 80%"
            format="yyyy-MM-dd hh:mm:ss"
            placeholder="选择日期">
          </el-date-picker>
        </div>
        <div style="overflow:hidden;margin-top:80px;">
          <a
            class="send"
            @click="releaseFlag = false"
            style="margin:0;border: 1px solid #5ea0ff;color: #4080ff;width:80px;"
          >取 消</a
          >
          <a class="save" @click="publish">发布</a>
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<script>
  import Header from "../common/header";
  import Footer from "../common/footer";
  import config from "../../config.js";

  var autoTextarea = function (elem, extra, maxHeight) {
    extra = extra || 0;
    var isFirefox = !!document.getBoxObjectFor || "mozInnerScreenX" in window,
      isOpera = !!window.opera && !!window.opera.toString().indexOf("Opera"),
      addEvent = function (type, callback) {
        elem.addEventListener
          ? elem.addEventListener(type, callback, false)
          : elem.attachEvent("on" + type, callback);
      },
      getStyle = elem.currentStyle
        ? function (name) {
          var val = elem.currentStyle[name];

          if (name === "height" && val.search(/px/i) !== 1) {
            var rect = elem.getBoundingClientRect();
            return (
              rect.bottom -
              rect.top -
              parseFloat(getStyle("paddingTop")) -
              parseFloat(getStyle("paddingBottom")) +
              "px"
            );
          }

          return val;
        }
        : function (name) {
          return getComputedStyle(elem, null)[name];
        },
      minHeight = parseFloat(getStyle("height"));

    elem.style.resize = "none";

    var change = function () {
      var scrollTop,
        height,
        padding = 0,
        style = elem.style;

      if (elem._length === elem.value.length) return;
      elem._length = elem.value.length;

      if (!isFirefox && !isOpera) {
        padding =
          parseInt(getStyle("paddingTop")) + parseInt(getStyle("paddingBottom"));
      }
      scrollTop = document.body.scrollTop || document.documentElement.scrollTop;

      elem.style.height = minHeight + "px";
      if (elem.scrollHeight > minHeight) {
        if (maxHeight && elem.scrollHeight > maxHeight) {
          height = maxHeight - padding;
          style.overflowY = "auto";
        } else {
          height = elem.scrollHeight - padding;
          style.overflowY = "hidden";
        }
        style.height = height + extra + "px";
        scrollTop += parseInt(style.height) - elem.currHeight;
        document.body.scrollTop = scrollTop;
        document.documentElement.scrollTop = scrollTop;
        elem.currHeight = parseInt(style.height);
      }
    };

    addEvent("propertychange", change);
    addEvent("input", change);
    addEvent("focus", change);
    change();
  };
  export default {
    components: {
      Header,
      Footer
    },
    data() {
      return {
        pickerOptions: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 24 * 60 * 60 * 1000;
          },
          onPick(time) {
            let timeRange = 24 * 60 * 60 * 1000;
            if (time.maxDate && time.minDate) {
              if (time.maxDate.getTime() - time.minDate.getTime() < timeRange) {
                this.$message.warning("至少1天");
                time.$emit("pick", [null, null]);
              }
            }
          }
        },
        organizationName: "",
        loading1: false,
        flag3: false,
        flag: 0,
        id2: "",
        sendFlag: false,
        sendFlag1: false,
        allData: [],
        suggest2: "",
        allFlag1: false,
        allFlag2: false,
        allFlag3: false,
        allFlag4: false,
        selectData2: [],
        selectData3:[],
        currentPage: 1,
        total: 0,
        radios: [1, 2, 3],
        detailData1: [],
        detailData2: [],
        detailData3: [],
        detailData4: [],
        selectArr: {},
        types: [],
        smsTemplate: '',
        formInline: {
          province: "",
          key: ""
        },
        joinData: [],
        value1: [],
        appiontTime: [],
        data4: [],
        userIds: '',
        appiontList: [],
        selectData:{},
        obj:[],
        timeout: null,
        releaseFlag:false,
        releaseTime:'',
        releaseUser:'',
        publishList:[],
        tagTemplate:''
      };
    },
    mounted() {
      this.getjoinData();
      this.getProvince();
      this.getSelect();
      this.getAppiontList();
    },
    methods: {
      selectTime(){
        var template=this.tagTemplate
        var startTime=new Date(this.appiontTime[0]).getFullYear() + "-" + (this.appiontTime[0].getMonth() + 1) + "-" + this.appiontTime[0].getDate()
        var endTime=new Date(this.appiontTime[1]).getFullYear() + "-" + (this.appiontTime[1].getMonth() + 1) + "-" + this.appiontTime[1].getDate()
         template=template.replace('{1}',startTime).replace("{2}",endTime)
        this.smsTemplate=template
      },
      downFile(n) {
        console.log(this.joinData[0])
        let params = {
          companyId: JSON.parse(localStorage.getItem("user")).companyId,
          // planSummaryId: this.joinData[0].id,
          reviewType: n
          // userName: JSON.parse(localStorage.getItem("user")).userName
        };
        this.$axios({
          method: "get",
          url: config.baseUrl + 'bsReviewSendCompany/v1.0/export/review/tables/' + JSON.parse(localStorage.getItem("user")).companyId + '/' + n
        }).then(res => {
          if (res.data.meta.success) {
            const iframe = document.createElement("iframe");
            iframe.style.display = "none"; // 防止影响页面
            iframe.style.height = 0; // 防止影响页面
            iframe.src = res.data.data;
            document.body.appendChild(iframe); // 这一行必须，iframe挂在到dom树上才会发请求
            // 5分钟之后删除（onload方法对于下载链接不起作用，就先抠脚一下吧）
            setTimeout(() => {
              iframe.remove();
            }, 5 * 60 * 1000);
          } else {
            this.$message.warning(res.data.meta.message)
          }
        })
          .catch(response => {
            console.log(response);
          });
      },
      clickPrinting(n) {
        this.$print(this.$refs["print" + n]);
      },
      goDetail(n, id, id1) {
        this.id1 = id;
        this["allFlag" + n] = true;
        if (n == 4) {
          this.getPersonDetail(id1);
          this.id2 = id1;
        } else {
          this.getDetail(n, id);
        }
      },
      savePersonAll() {
        if (this.organizationName == "") {
          this.$message.warning("请填写应急预案编制人员");
        } else {
          let id = "";
          let url = config.baseUrl + "emergency/v1.0/review/edit";
          this.selectData2.map(item => {
            if (item.identity == "组长") {
              id = item.userId;
            }
          });
          let param = {
            organizationName: this.organizationName,
            reviewType: "4",
            planSummaryId: this.joinData[0].id,
            id: this.id2
          };
          this.$axios.post(url, param).then(res => {
            if (res.data.meta.success) {
              this.$message.success(res.data.meta.message);
              this.getPersonDetail(this.id2);
            } else {
              this.$message.warning(res.data.meta.message);
            }
          });
        }
      },
      getPersonDetail(id) {
        let url = config.baseUrl + "emergency/v1.0/review/look?id=" + id;
        this.$axios.post(url).then(res => {
          if (res.data.meta.success) {
            this.signImg4 = res.data.data.url;
            this.detailData4 = res.data.data.list;
            if (res.data.data.list[0].organizationName) {
              this.organizationName = res.data.data.list[0].organizationName;
            }
            this.consensus = res.data.data.list[0].consensus;
            this.remark5 = res.data.data.list[0].remarks;
            this.suggest2 = res.data.data.list[0].opinion;

            this.$nextTick(() => {
              var text = document.getElementById("textarea");
              autoTextarea(text);
            });
          } else {
            this.$message.warning(res.data.meta.message);
          }
        });
      },
      getDetail(n, id) {
        let url = config.baseUrl + "bsReview/v1.0/review/summaryInfoByType?planSummaryId=" + id + "&reviewType=" + n;
        this.$axios.get(url).then(res => {
          if (res.data.meta.success) {
            this["signImg" + n] = res.data.data.url;
            this["detailData" + n] = res.data.data.list;
          } else {
            this.$message.warning(res.data.meta.message);
          }
        });
      },
      addPen() {
         this.flag = 0;
       // this.$refs.multipleTable1.clearSelection();
        this.selectArr = {};
        this.getAllList();
        this.getAppiontList();
      },
      handleSelectionChange(val) {
        this.selectArr["obj" + this.currentPage] = val;
        let num = this.selectData2.length;
        let obj = this.selectArr;
        for (var i in obj) {
          num += obj[i].length;
        }
        val.map((item, index) => {
          if (item.companyId == JSON.parse(localStorage.user).companyId) {
            this.$message.warning(
              "请选择与" +
              JSON.parse(localStorage.user).companyName +
              "无利益关系的专家"
            );
            this.$nextTick(() => {
              this.$refs.multipleTable1.toggleRowSelection(
                val[val.length - 1],
                false
              );
            });
          }
        });
        /*if (num > 5) {
          this.$message.warning("专家评审团人员不能超过5个");
          this.$nextTick(() => {
            this.$refs.multipleTable1.toggleRowSelection(
              val[val.length - 1],
              false
            );
          });
        }*/
      },
      startSet() {
        let num = 0;
        let obj = this.selectArr;
        for (var i in obj) {
          num += obj[i].length;
        }
        if (num > 0) {
          /*if (num % 2 == 0) {
            this.$message.warning("请确保专家评审团人员数量为奇数");
          } else {*/
            let ids = "";
            for (var i in obj) {
              obj[i].map(item => {
                ids += item.userId + ",";
              });
           /* }*/
            if (ids != "") {
              // this.saveSelect(ids.substring(0, ids.length - 1));
              this.userIds = ids
              let param = {
                companyId: JSON.parse(localStorage.user).companyId,
                smsType: "4"
              };
              this.$axios
                .post(config.baseUrl + "special/v1.0/special/appointmentsms", param)
                .then(res => {
                  if (res) {
                    this.smsTemplate= res.data.data.smsContent.replace("{0}",JSON.parse(localStorage.getItem("user")).companyName)
                    this.tagTemplate= res.data.data.smsContent.replace("{0}",JSON.parse(localStorage.getItem("user")).companyName)
                  }
                  this.getAllList()
                  this.getAppiontList();
                })
                .catch(response => {
                  console.log(response);
                });
              this.sendFlag1 = true
            }

            //this.getSelect();
            //  this.flag = 1;
          }
        } else {
          this.$message.warning("请选择预约评审专家");
        }
      },
      getProvince() {
        this.$axios
          .post(config.baseUrl + "special/v1.0/special/Province")
          .then(res => {
            if (res) {
              this.types = res.data;
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      deleteRole(id) {
        this.$axios
          .post(config.baseUrl + "special/v1.0/special/delete?id=" + id)
          .then(res => {
            if (res.data.meta.success) {
              this.$message.success(res.data.meta.message);
              this.getSelect();
            } else {
              this.$message.warning(res.data.meta.message);
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      saveSelect(ids) {
        this.$axios
          .post(config.baseUrl + "special/v1.0/special/save", {
            companyId: JSON.parse(localStorage.user).companyId,
            userId: ids
          })
          .then(res => {
            if (res.data.meta.success) {
              this.$message.success(res.data.meta.message);
              this.$refs.multipleTable1.clearSelection();
              this.selectArr = {};
              this.getSelect();
            } else {
              this.$message.warning(res.data.meta.message);
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      sendSelect2() {
        this.$axios
          .post(config.baseUrl + "special/v1.0/special/send", {
            planSummaryId: this.joinData[0].id
          })
          .then(res => {
            if (res.data.meta.message == "已发送，无需再发送") {

              //  this.flag = 2;
              this.getSelect();
            } else {
              this.flag3 = true;
              this.getAllList();
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      beforeSend() {
        let flag4 = false;
        let flag5 = "";
        this.selectData2.map(item => {
          if (item.identity == "/") {
            flag4 = true;
          }
          if (item.identity == "组长") {
            flag5 = true;
          }
        });
        if (flag4) {
          this.$message.warning("请给专家任命角色");
        } else if (!flag5) {
          this.$message.warning("请任命一个组长");
        } else {
          if (this.value1.length != 2) {
            this.$message.warning("评审时间不能为空");
          } else {
            if (this.selectData2.length % 2 == 0) {
              this.$message.warning("专家评审团人员数量不能为偶数");
            } else {
              if (this.selectData2.length == 1) {
                this.$message.warning("专家评审团人员数量不能少于3人");
              } else {
                this.sendFlag = true;
              }
            }
          }
        }
      },
      sendSelect() {
        let reviewStartTime =
          new Date(this.value1[0]).getFullYear() +
          "-" +
          (this.value1[0].getMonth() + 1) +
          "-" +
          this.value1[0].getDate();
        let reviewEndTime =
          new Date(this.value1[1]).getFullYear() +
          "-" +
          (this.value1[1].getMonth() + 1) +
          "-" +
          this.value1[1].getDate();
        this.$axios
          .post(config.baseUrl + "special/v1.0/special/send", {
            planSummaryId: this.joinData[0].id,
            reviewEndTime: reviewEndTime,
            reviewStartTime: reviewStartTime,
            companyName: JSON.parse(localStorage.user).companyName
          })
          .then(res => {
            if (res.data.meta.success) {
              this.$message.success(res.data.meta.message);
              //this.flag = 2;
              this.getSelect();

              this.sendFlag = false;
            } else {
              this.$message.warning(res.data.meta.message);
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      getSelect() {
        this.$axios
          .post(
            config.baseUrl +
            "special/v1.0/special/list?size=10&companyId=" +
            JSON.parse(localStorage.user).companyId +
            "&current=" +
            1
          )
          .then(res => {
            if (res.data.meta.success) {
              if (res.data.data.records.length > 0) {
                res.data.data.records.map(item => {
                  if (!item.identity) {
                    item.identity = "/";
                  }
                });
              }
              this.selectData2 = res.data.data.records;
              this.flag=1
              console.log(res.data.data.records[0].startTime)
              if(res.data.data.records[0].startTime){
                this.selectData3=res.data.data.records;
                this.flag=2
                this.summarylist();
                this.getPubishList()
              }
              if (this.flag != 2) {
                // this.flag = 1;
              }
            } else {
              if (res.data.meta.message != "暂无数据") {
                this.$message.warning(res.data.meta.message);
              }
              this.selectData2 = [];
              // this.flag = 0;
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      setBefore(id, n) {
        let id1 = "";
        this.selectData2.map(item => {
          if (item.identity == "组长") {
            id1 = item.id;
          }
        });
        if (n == 1 && id1 != "") {
          this.startSetRole(id1, 2);
        }

        this.startSetRole(id, n);
      },
      startSetRole(id, n) {
        this.$axios
          .post(config.baseUrl + "special/v1.0/special/edit", {
            id: id,
            identity: n,
            planSummaryId: ""
          })
          .then(res => {
            if (res.data.meta.success) {
              this.allData = res.data.data;
              this.getSelect();
            } else {
              if (res.data.meta.message != "暂无数据") {
                this.$message.warning(res.data.meta.message);
              }
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      summarylist() {
        this.$axios
          .get(
            config.baseUrl +
            "bsReviewSendCompany/v1.0/company/queryCompanySummaryList?companyId=" +
            this.joinData[0].companyId
          )
          .then(res => {
            if (res.data.meta.success) {
              this.data4 = res.data.data;
            } else {
              if (res.data.meta.message != "暂无数据") {
                this.$message.warning(res.data.meta.message);
              }
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      reset() {
        this.formInline.province = "";
        this.currentPage = 1;
        this.formInline.key = "";
        let url = config.baseUrl + "special/v2.0/special/appointmentspecialist";

       /* if (this.selectData2.length > 0) {
          url = config.baseUrl + "special/v1.0/special/editList";
        }*/
        this.loading1 = true;
        this.$axios
          .post(url, {
            businessId: JSON.parse(localStorage.user).businessId,
            companyId: JSON.parse(localStorage.user).companyId,
            current: this.currentPage,
            planSummaryId: this.joinData[0].id,
            keyWord: this.formInline.key,
            region: this.formInline.province,
            size: 10
          })
          .then(res => {
            this.loading1 = false;

            if (res.data.meta.success) {
              this.allData = res.data.data.records;
              this.total = res.data.data.total;
              var arr = this.selectArr["obj" + this.currentPage];
            } else {
             // this.$message.warning(res.data.meta.message);
              this.allData = [];
              this.total = 0;
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      getAllList() {//获取专家
        let url = config.baseUrl + "special/v2.0/special/appointmentspecialist";
        if (this.selectData2.length > 0) {
          url = config.baseUrl + "special/v2.0/special/appointmentspecialist";
        }
        this.loading1 = true;
        this.$axios
          .post(url, {
            businessId: JSON.parse(localStorage.user).businessId,
            companyId: JSON.parse(localStorage.user).companyId,
            planSummaryId: this.joinData[0].id,
            current: this.currentPage,
            keyWord: this.formInline.key,
            region: this.formInline.province,
            size: 10
          })
          .then(res => {
            this.loading1 = false;

            if (res.data.meta.success) {
              this.allData = res.data.data.records;
              this.total = res.data.data.total;
              var arr = this.selectArr["obj" + this.currentPage];
              if (arr) {
                this.allData.map(item => {
                  arr.map(item2 => {
                    if (item2.id == item.id) {
                      this.$nextTick(() => {
                        this.$refs.multipleTable1.toggleRowSelection(item);
                      });
                    }
                  });
                });
              }
            } else {
            //  this.$message.warning(res.data.meta.message);
              this.allData = [];
              this.total = 0;
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      getjoinData() {//获取预案
        this.$axios
          .post(config.baseUrl + "emergency/v1.0/summary/plans", {
            companyId: JSON.parse(localStorage.user).companyId
          })
          .then(res => {
            if (res.data.meta.success) {
              this.joinData = res.data.data;
              this.getAllList();
              this.sendSelect2();
            } else {
              if (res.data.meta.message != "暂无数据") {
                this.$message.warning(res.data.meta.message);
              }
              this.joinData = [];
              this.getAllList();
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      handleCurrentChange(val) {
        this.currentPage = val;
        this.getAllList();
      },
      sendAppiont() {
        if (this.appiontTime.length != 2) {
          this.$message.warning("预约时间不能为空");
          return
        }
        if (this.smsTemplate == '') {
          this.$message.warning("短信模板不能为空");
          return
        }
        let appointStartTime =
          new Date(this.appiontTime[0]).getFullYear() +
          "-" +
          (this.appiontTime[0].getMonth() + 1) +
          "-" +
          this.appiontTime[0].getDate();
        let appointEndTime =
          new Date(this.appiontTime[1]).getFullYear() +
          "-" +
          (this.appiontTime[1].getMonth() + 1) +
          "-" +
          this.appiontTime[1].getDate();
        this.$axios
          .post(config.baseUrl + "special/v2.0/special/sendspecial", {
            companyId: JSON.parse(localStorage.user).companyId,
            planSummaryId: this.joinData[0].id,
            userIds: this.userIds,
            phoneUser:this.obj.join(","),
            userName: JSON.parse(localStorage.user).userName,
            smsType: '4',
            smsContent: this.smsTemplate,
            appointStartTime: appointStartTime,
            appointEndTime: appointEndTime
          })
          .then(res => {
            this.$message.success("发送成功");
            this.getAppiontList();
            this.getAllList();

          })
          .catch(response => {
            console.log(response);
          });
        this.sendFlag1 = false
      },
      confirm(val,item) {
    /*    this.$nextTick(() => {
          this.$refs.multipleTable1.toggleRowSelection(item);
        });*/
        let num=this.obj.indexOf(val)
        if(num==-1){
          this.obj.push(val
          )
        }else{
          this.obj.splice(num,1)
        }
     /*   this.$axios
          .post(config.baseUrl + "special/v1.0/special/confirmation", {
            companyId: JSON.parse(localStorage.user).companyId,
            planSummaryId: this.joinData[0].id,
            requiredTime: this.getDate(),
            status: '1',
            userId: val
          })
          .then(res => {
            if (res.success) {
              this.$message.success("操作成功");
              this.getAppiontList()
            } else {
              this.$message.warning(res.data.meta.message);
            }
          })
          .catch(response => {
            console.log(response);
          });*/
      },
      getAppiontList() {
        this.loading1 = true;
        this.$axios
          .post(config.baseUrl + "special/v2.0/special/queryappointmentlist?companyId=" + JSON.parse(localStorage.user).companyId + "&current=" + this.currentPage + "&size=" + 20, {
            /* companyId: JSON.parse(localStorage.user).companyId,
             current: this.currentPage,
             size: 20*/
          })
          .then(res => {
            this.loading1 = false;
            if (res.data.meta.success) {
              this.appiontList = res.data.data.records;
            } else {
             // this.$message.warning(res.data.meta.message);
              this.appiontList = [];
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      dateFormat(row, column) {
        // 获取单元格数据
        let data = row[column.property]
        if (data == null) {
          return null
        }
        let dt = new Date(data)
        return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate()
      },
      stateFormat(row, column) {
        if (row.status == 0) {
          return '已预约'
        } else if (row.status == 1) {
          return '预约成功'
        } else {
          return '预约失败'
        }
      },

      getDate() {
        //时间格式化补0
        var zeroize = function (value, length) {
          if (!length) length = 2;
          value = String(value);
          for (var i = 0, zeros = ''; i < (length - value.length); i++) {
            zeros += '0';
          }
          return zeros + value;
        };
        var myDate = new Date();
        return myDate.getFullYear() + "-" + zeroize(myDate.getMonth() + 1) + "-" + zeroize(myDate.getDate());
      },
      changeFun(val){
        this.selectData[obj] = val;
        let num = this.selectData2.length+val.length;
        let obj = this.selectData;
   /*     for (var i in obj) {
          num += obj[i].length;
        }*/
        let flag=false;
        val.map((item, index) => {
    /*      if(item.status!=1){
            this.$message.warning(
              "请选择预约成功的专家"
            );
            this.$nextTick(() => {
              this.$refs.multipleTable2.toggleRowSelection(
                val[val.length - 1],
                false
              );
            });
          }*/
          for (var j in this.selectData2){
            if(this.selectData2[j].userId==item.userId){
              num=num-1
              clearTimeout(this.timeout)
              this.timeout = setTimeout(()=>{
                this.$message.warning(
                  "不能选择重复的专家"
                );
              })
              this.$nextTick(() => {
                this.$refs.multipleTable2.toggleRowSelection(
                  val[val.length - 1],
                  false
                );
              });
            }
          }
        });
     /*   if (num > 5) {
          this.$message.warning("专家评审团人员不能超过5个");
          this.$nextTick(() => {
            this.$refs.multipleTable2.toggleRowSelection(
              val[val.length - 1],
              false
            );
          });
        }*/
      },
      startSet1() {
        let num = this.selectData2.length;
        ;
        let obj = this.selectData;
        console.log(obj)
        for (var i in obj) {
          num += obj[i].length;
        }
        if (num > 0) {
          if(num>=3 && num<=5){
            if (num % 2 == 0) {
              this.$message.warning("请确保专家评审团人员数量为奇数");
            } else {
              let ids = "";
              for (var i in obj) {
                obj[i].map(item => {
                  ids += item.userId + ",";
                });
              }
              if (ids != "") {
                this.saveSelect(ids.substring(0, ids.length - 1));
              }
              this.getSelect();
              //  this.flag = 1;
            }
          }else{
            this.$message.warning("专家评审人员不能超过5人不能少于3人");
          }
        } else {
          this.$message.warning("请选择评审专家");
        }
      },
      publish() {
        if(!this.releaseTime){
          this.$message.warning("签发日期不能为空")
          return
        }
        if(!this.releaseUser){
          this.$message.warning("签发人不能为空")
          return
        }
        let params = {
          "companyId": JSON.parse(localStorage.getItem('user')).companyId,
          "signTime": this.releaseTime,
          "signUser": this.releaseUser,
          "userName": JSON.parse(localStorage.getItem('user')).userName

        }
        this.$axios
        ({
          method: 'post',
          url: this.$baseUrl + "/emergency/v1.0/plan/publish/save",
          data: params
        }).then(
          (res) => {
            if (res.data.meta.success) {
              this.releaseFlag=false
              this.$message({
                message: "保存成功",
                type: 'success'
              });
              this.getPubishList()
            } else {
              this.$message({
                message: res.data.meta.message,
                type: 'error'
              });
            }
            this.releaseFlag=false
          })
      },
      getPubishList () {
        this.$axios({
          method: "get",
          url: this.$baseUrl + "/emergency/v1.0/plan/publish/list/" + JSON.parse(localStorage.getItem("user")).companyId
        })
          .then(res => {
            if (res.data.meta.success) {
              this.publishList=res.data.data
            } else {
              this.$message.warning(res.data.meta.message)
            }
          })
          .catch(response => {
            console.log(response);
          });
      },
      look (id) {
        //查看
        this.$axios({
          method: "get",
          url: this.$baseUrl + "/emergency/v1.0/plan/publish/info/"+id,
        }).then(res => {
          if (res.data.meta.success) {
            if(res.data.data.signTemplateFile){
              this.lookmsg(res.data.data)
            }else{
              this.$message.warning("数据不存在")
            }
          }
        });
      },
      lookmsg(item) {
        let url = item.signTemplateFile;
        var tempwindow = window.open('_blank');//打开一个窗口，然后用
        tempwindow.location = url;//使这个窗口跳转到百度，这样就会呈现弹出百度窗口的效果了。
      },
      download (id) {
        this.$axios({
          method: "get",
          url: this.$baseUrl + "/emergency/v1.0/plan/publish/export/"+id,
        }).then(res => {
          if (res.data.meta.success) {
            if(res.data.data){
              window.location.href= res.data.data;
            }else{
              this.$message.warning("数据不存在")
            }
          }
        });
      },
    },
    filters: {
      timeBy(val) {
        if (val) {
          return val.substring(0, 10)
        }
      },
    },
  };
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang='less'>
  @media print {
    h2 {
      font-weight: bold;
      font-size: 20px;
      color: #333;
      text-align: center;
      margin-bottom: 25px;
    }

    .radioImg {
      text-align: center;
      font-size: 20px;
    }

    .edit-name {
      .el-input__inner {
        border: 0;
        padding: 0;
      }
    }

    .comName {
      font-weight: bold;
      color: #333;
      padding-left: 5px;
      margin-bottom: 8px;
    }

    .ideaTitle {
      font-weight: bold;
      font-size: 20px;
      color: #333;
      text-align: center;
      margin-bottom: 25px;
    }

    .ideaTable {
      width: 100%;
      border: 1px solid #ddd;
      border-collapse: collapse;
      color: #333;

      th {
        border: 1px solid #ccc;
        width: 100px;
        font-weight: 700;
        line-height: 30px;
      }
      .is-ok {
        width: 100px;
        font-weight: 100;
      }
      td {
        border: 1px solid #ddd;
        border-collapse: collapse;
        padding: 15px 10px;
        line-height: 24px;

        strong {
          font-weight: bold;
          display: block;
          text-align: center;
        }

        img {
          width: 120px;
          height: 60px;
        }
      }
      .firtTit {
        padding: 0 10px;
        width: 120px;
        text-align: center;
      }
      td:first-child {
        text-align: center;
      }
      .radioImg {
        img {
          width: 25px;
          height: 25px;
          display: block;
          margin: 0 auto;
        }
      }
    }
  }

  .online {
    .print-btn {
      background: #4080ff;
      float: right;
      color: #fff;
      position: absolute;
      top: 64px;
      right: 68px;
    }
    .print-btn:hover {
      background: #4080ff;
      color: #fff;
      opacity: 0.8;
    }
    .el-textarea.is-disabled {
      .el-textarea__inner {
        background: #fff;
        color: #333;
        height: auto;
      }
    }
    dl {
      margin-top: 40px;
      margin-bottom: 20px;
      font-size: 14px;
      .dl-btn {
        display: inline-block;
        padding: 0 10px;
        height: 36px;
        text-align: center;
        line-height: 36px;
        border-radius: 6px;
        text-align: center;
        margin-bottom: 14px;
      }
      dt.dl-btn {
        background: #f6f9ff;
        color: #3f80ff;
      }
      dd {
        margin-bottom: 10px;
        color: #808080;
        line-height: 36px;
        a {
          color: #30dd05;
          text-decoration: underline;
        }
        span.dl-btn {
          background: #f6f9ff;
          color: #3f80ff;
          padding: 0 20px;
          margin: 0 10px;
        }
      }
    }
    .el-dialog__title {
      font-size: 18px;
      font-weight: 700;
    }
    .mianOut {
      padding: 0 30px;
      background: #fff;
      .note {
        height: 42px;
        line-height: 42px;
        p {
          color: #666;
          padding-left: 42px;
          img {
            width: 26px;
            height: 26px;
            margin-right: 5px;
          }
        }
      }
      .asTitle {
        h3 {
          font-weight: bold;
          font-size: 16px;
          color: #666;
          padding: 20px 0 0 20px;
        }
      }
      .mianInner {
        background: #fff;
        padding-bottom: 30px;

        .asList {
          width: 300px;
          height: 49px;
          margin: 20px auto;
          border: 1px solid #4080ff;
          border-radius: 8px;
          li {
            float: left;
            width: 50%;
            a {
              display: block;
              color: #666;
              height: 47px;
              text-align: center;
              line-height: 47px;
            }
            a.active {
              color: #fff;
              background: #4080ff;
            }
            a.active:hover {
              color: #fff;
            }
            a:hover {
              color: #4080ff;
            }
          }
          li:first-child {
            a {
              border-radius: 8px 0 0 8px;
            }
          }
          li:last-child {
            a {
              border-radius: 0 8px 8px 0;
            }
          }
        }
        .expert_main {
          .asBtns {
            padding: 0 90px 0 100px;
            .el-form {
              .formBtn {
                display: block;
                float: left;
                width: 160px;
                height: 36px;
                text-align: center;
                line-height: 36px;
                color: #fff;
                border-radius: 8px;
                background: #4080ff;
               /* background: linear-gradient(
                  left,
                  #6fb2ff 0%,
                  #095fff 100%
                );*/
                margin-top: 3px;
                cursor: pointer;
              }
              .formBtn:hover {
                opacity: 0.8;
              }
              .el-input__inner {
                height: 36px;
              }
              .el-button.search {
                color: #fff;
                border: none;
                border-radius: 8px;
                width: 79px;
                height: 36px;
                background: #4080ff;
              /*  background: linear-gradient(
                  left,
                  #6fb2ff 0%,
                  #095fff 100%
                );*/
                padding: 0;
                line-height: 36px;
                img {
                  position: relative;
                  top: -1px;
                  margin-right: 5px;
                }
              }
            }
          }

          .el-button:hover {
            opacity: 0.8;
          }
          /*表格*/
          .el-table {
            width: calc(100% - 200px);
            margin: 0 auto;
            border-top: 1px solid #ebeef5;
            .fileName {
              text-decoration: underline;
              color: #4080ff;
              cursor: pointer;
            }
            .fileName:hover {
              opacity: 0.8;
            }
          }

          .el-table th > .cell {
            color: #333333;
            font-weight: bold;
          }
          .page-container {
            display: flex;
            justify-content: center;
            margin-top: 30px;
            .el-button {
              height: 28px;
              padding: 0 10px;
              margin-top: 4px;
              border-radius: 8px;
            }
          }
        }

        .waitSend {
          /*表格*/
          .el-table {
            width: calc(100% - 200px);
            margin: 0 auto;
            border-top: 1px solid #ebeef5;
            .fileName {
              text-decoration: underline;
              color: #4080ff;
              cursor: pointer;
            }
            .fileName:hover {
              opacity: 0.8;
            }
          }
          .el-button {
            border-radius: 8px;
            border: 1px solid #eef4fd;
            background: #eef4fd;
            height: 36px;
            padding: 0;
            width: 85px;
            color: #4080ff;
          }

          .el-button:hover {
            background: #fff;
            border-color: #4080ff;
          }
          .detail-btn.active {
            background: #4080ff !important;
            color: #fff !important;
            border: 1px solid #4080ff !important;
          }
          .detail-btn.active:hover {
            opacity: 0.8;
            background: #4080ff;
            color: #fff;
            border-color: #4080ff;
          }
          .el-table th > .cell {
            color: #333333;
            font-weight: bold;
          }
          .sendMain1 {
            background: #fff;
            padding-bottom: 30px;

            .el-button:hover {
              opacity: 0.8;
            }
            .formbtns {
              margin: 40px 0 20px;
            }
          }
          .sendMain2 {
            background: #fff;
            margin-top: 20px;

            .timeSelect {
              text-align: center;
              .el-date-editor .el-range-separator {
                width: 6%;
              }
            }
          }
          .sendMain3 {
            background: #fff;
            margin-top: 30px;
            padding-bottom: 30px;
          }
        }

        .backInfo {
          .infoMain1 {
            background: #fff;
            padding-bottom: 30px;
            p {
              line-height: 36px;
              font-weight: bold;
              font-size: 14px;
              color: #666;
              text-align: center;
              margin-top: 30px;

              i {
                font-size: 20px;
                color: #69ed79;
                margin-right: 10px;
                position: relative;
                top: 3px;
              }
            }
            .timeSelect {
              text-align: center;
              .el-date-editor .el-range-separator {
                width: 6%;
              }
            }
            .el-button:hover {
              opacity: 0.8;
            }
            .downBox {
              margin: 40px 0 20px;
              .download {
                display: block;
                float: right;
                margin-right: 100px;
                width: 79px;
                height: 36px;
                text-align: center;
                line-height: 36px;
                color: #4080ff;
                border-radius: 8px;
                background: #eefdf4;
                cursor: pointer;
                i {
                  font-size: 18px;
                  position: relative;
                  top: 2px;
                }
              }
              .download:hover {
                opacity: 0.8;
              }
            }
            /*表格*/
            .el-table {
              width: calc(100% - 200px);
              margin: 0 auto;
              border-top: 1px solid #ebeef5;
              .fileName {
                text-decoration: underline;
                color: #4080ff;
                cursor: pointer;
              }
              .fileName:hover {
                opacity: 0.8;
              }
            }

            .el-table th > .cell {
              color: #333333;
              font-weight: bold;
            }
          }
          .infoMain2 {
            background: #fff;
            padding-bottom: 80px;
            margin-top: 30px;

            p {
              line-height: 36px;
              font-weight: bold;
              font-size: 14px;
              color: #666;
              text-align: center;
              margin-top: 60px;

              i {
                font-size: 20px;
                color: #69ed79;
                margin-right: 10px;
                position: relative;
                top: 3px;
              }

              a {
                display: inline-block;
                margin-left: 25px;
                width: 150px;
                height: 36px;
                color: #fff;
                border-radius: 8px;
                line-height: 36px;
                text-align: center;
                cursor: pointer;
                font-weight: normal;
                background: #4080ff;
               /* background: linear-gradient(
                  left,
                  #6fb2ff 0%,
                  #095fff 100%
                );*/
              }

              a:hover {
                opacity: 0.8;
              }
            }
          }
        }
      }
    }
    .ideaMain {
      padding: 0 50px;

      .ideaTitle {
        font-weight: bold;
        font-size: 20px;
        color: #333;
        text-align: center;
        margin-bottom: 25px;
      }

      .comName {
        font-weight: bold;
        color: #333;
        padding-left: 5px;
        margin-bottom: 8px;
      }

      .ideaTable {
        width: 100%;
        border: 1px solid #ddd;
        border-collapse: collapse;
        color: #333;
        th {
          border: 1px solid #ccc;
          font-weight: 700;
        }
        .is-ok {
          width: 100px;
          font-weight: 100;
        }
        td {
          border: 1px solid #ddd;
          border-collapse: collapse;
          padding: 15px 10px;
          line-height: 24px;

          strong {
            font-weight: bold;
            display: block;
            text-align: center;
          }

          img {
            width: 120px;
            height: 60px;
          }
        }

        td:first-child {
          text-align: center;
        }
        .radioImg {
          text-align: center;
          font-size: 20px;
        }
      }

      .table_save {
        margin-top: 20px;
        display: block;
        width: 79px;
        height: 36px;
        text-align: center;
        line-height: 36px;
        float: right;
        color: #fff;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        background: #4080ff;
        /*background: linear-gradient(left, #6fb2ff 0%, #095fff 100%);*/
      }
      .table_save:hover {
        opacity: 0.8;
      }

      .el-textarea__inner {
        resize: none;
        border: none;
        cursor: pointer;
        height: 100px;
        padding: 0;
      }
      .ideaTable1 {
        thead {
          line-height: 30px;

          tr:first-child {
            th {
              font-weight: 800;
              min-width: 80px;
            }
          }
        }
      }
    }
    .edit-name {
      .el-input__inner {
        border: 0;
        padding: 0;
      }
    }
  }
  .btnactive{
    background: #2db0fd !important;
    color: #fff !important;
  }
</style>
<style lang="less" scoped>
  tr,
  td,
  tr p,
  textarea {
    cursor: default;
  }

  .exitTcNote {
    padding-left: 40px;
    margin: 30px 0;
    font-size: 16px;
    display: block;
    background: url(../../../static/images/warn_icon.png) no-repeat left 5px center;
    background-size: 30px 30px;
    line-height: 26px;
  }

  .save {
    display: block;
    float: right;
    margin-right: 15px;
    width: 79px;
    height: 36px;
    font-size: 14px;
    text-align: center;
    line-height: 36px;
    color: #fff;
    border-radius: 8px;
    background: #4080ff;
    /*background: linear-gradient(left, #6fb2ff 0%, #095fff 100%);*/
    cursor: pointer;
  }

  .save:hover,
  .send2:hover {
    opacity: 0.8;
  }

  .send {
    font-size: 14px;
    display: block;
    float: right;
    margin-right: 100px;
    width: 120px;
    height: 36px;
    text-align: center;
    cursor: pointer;
    line-height: 36px;
    border-radius: 8px;
    color: #fff;
  }

  .send1 {
    background: #ccc;
    cursor: no-drop;
  }

  .send2 {
    cursor: pointer;
    background: #4080ff;
    /*background: linear-gradient(left, #6fb2ff 0%, #095fff 100%);*/
  }
</style>
<style scoped>
  .online .mianOut {
    width: calc(100% - 60px);
    margin: 0 auto;
  }

  .online .mianOut .note p {
    padding-left: 0;
  }

  .current-nav {
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding-left: 30px;
    color: #939393;
    font-size: 14px;
    background: #f3f3f3;
  }

  .current-nav a {
    color: #939393;
    font-size: 14px;
  }

  .online .mianOut .note {
    padding: 20px 0;
    height: 82px;
  }
</style>
